  <body>
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">演示</a>
        <a>
          <cite>导航元素88</cite></a>
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
    </div>
    <div class="x-body">
      <div class="layui-row">
        <form class=" layui-col-md12 x-so layui-form-pane layui-form">
          <div class="layui-input-inline">
            <select name="cateid">
              <option>规则分类</option>
              <?php foreach ($cate as $row): ?>
              <option value="">{$row['cname']}</option>
              <?php endforeach ?>
            </select>
          </div>
          <div class="layui-input-inline">
            <select name="controller" lay-filter="getController">
              <option>控制器</option>
              <?php foreach ($controllers as $row): ?>
              <option value="{$row}">{$row}</option>
              <?php endforeach ?>
              
            </select>
          </div>
          <div class="layui-input-inline" lay-filter="test2" >
            <select  id="actions" >
              <option>方法</option>
              
             
            </select>
          </div>
          <input class="layui-input" placeholder="权限名" name="cate_name" >
          <button class="layui-btn"  lay-submit="" lay-filter="add"><i class="layui-icon"></i>增加</button>
        </form>
      </div>
      <xblock>
        <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
        <span class="x-right" style="line-height:40px">共有数据：88 条</span>
      </xblock>
      <table class="layui-table layui-form">
        <thead>
          <tr>
            <th>
              <div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
            </th>
            <th>ID</th>
            <th>权限规则</th>
            <th>权限名称</th>
            <th>所属分类</th>
            <th>状态</th>
            <th>操作</th>
        </thead>
        <tbody>
          <?php foreach ($data as $row): ?>

            
          
          <tr>
            <td>
              <div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
            </td>
            <td>{$row['rid']}</td>
            <td>{$row['rule']}</td>
            <td>{$row['name']}</td>
            <td>{$row['cname']}</td>
            <td class="td-status">
              <input type="checkbox"<?php if(!$row['status'])echo "checked"; ?> lay-filter='status' lay-skin="switch" lay-text="启用|停用" aid="{$row['rid']}">
            </td>
            <td class="td-manage">
              <a title="编辑"  onclick="x_admin_show('编辑','xxx.html')" href="javascript:;">
                <i class="layui-icon">&#xe642;</i>
              </a>
              <a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
                <i class="layui-icon">&#xe640;</i>
              </a>
            </td>
          </tr>
          <?php endforeach ?>
        </tbody>
      </table>
      <!-- <div class="page">
        <div>
          <a class="prev" href="">&lt;&lt;</a>
          <a class="num" href="">1</a>
          <span class="current">2</span>
          <a class="num" href="">3</a>
          <a class="num" href="">489</a>
          <a class="next" href="">&gt;&gt;</a>
        </div>
      </div> -->
      <div class="page" style="text-align: center">
                {$data->render()}
            </div>
          
    
    </div>
    <script>
      layui.use(['laydate', 'form'], function () {
        var laydate = layui.laydate;
        $ = layui.jquery;
        form = layui.form
        layer = layui.layer;

        form.on('select(getController)', function (data) {
          // console.log(data.elem); //得到select原始DOM对象
          // console.log(data.value); //得到被选中的值
          // console.log(data.othis); //得到美化后的DOM对象
          
          $.ajax({
            url: "{:url('admin/authrule/actioncate')}",
            type: 'POST',
            dataType: 'json',
            data: {controller: data.value},
          })
          .done(function(res) {
            $("#actions option").remove();
            var actions = res.actions;
            for (let index = 0; index < actions.length; index++) {
              $("#actions").append("<option value='"+actions[index]+"'>"+actions[index]+"</option>");
            }
            form.render('select');
          })
          .fail(function(){
            console.log('error');
          });
          //   $("#actions option").remove();
          // var actionsAll = $actionsAll;
          // // console.log(actionsAll[data.value]);
          // var actions = actionsAll[data.value];
          // for (let index = 0; index < actions.length; index++) {
          //   const element = actions[index];
          //   $("#actions").append("<option value='"+actions[index]+"'>"+actions[index]+"</option>");
            
          // }
          // form.render('select');

          
        });

        //监听提交
        form.on('submit(add)', function (data) {
          console.log(data.field);
          //发异步，把数据提交给php
          $.ajax({
            url: "{:url('admin/authcate/addsubmit')}",
            type: 'POST',
            dataType: 'json',
            data: data.field,
          })
            .done(function (res) {
              if (res.error) {
                console.log(res.info);
                layer.alert(res.info, { icon: 5 });
              } else {
                console.log(res.info);
                location.reload();
              }
            })
            .fail(function (res) {
              console.log(res.info);
            });
          return false;
        });


        //执行一个laydate实例
        laydate.render({
          elem: '#start' //指定元素
        });

        //执行一个laydate实例
        laydate.render({
          elem: '#end' //指定元素
        });
      });



      /*用户-停用*/
      function member_stop(obj, id) {
        layer.confirm('确认要停用吗？', function (index) {

          if ($(obj).attr('title') == '启用') {

            //发异步把用户状态进行更改
            $(obj).attr('title', '停用')
            $(obj).find('i').html('&#xe62f;');

            $(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
            layer.msg('已停用!', { icon: 5, time: 1000 });

          } else {
            $(obj).attr('title', '启用')
            $(obj).find('i').html('&#xe601;');

            $(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
            layer.msg('已启用!', { icon: 5, time: 1000 });
          }

        });
      }

      /*用户-删除*/
      function member_del(obj, id) {
        layer.confirm('确认要删除吗？', function (index) {
          //发异步删除数据
          $(obj).parents("tr").remove();
          layer.msg('已删除!', { icon: 1, time: 1000 });
        });

      }
      /*end*/




      function delAll(argument) {

        var data = tableCheck.getData();

        layer.confirm('确认要删除吗？' + data, function (index) {
          //捉到所有被选中的，发异步进行删除
          layer.msg('删除成功', { icon: 1 });
          $(".layui-form-checked").not('.header').parents('tr').remove();
        });
      }



    </script>
  </body>

</html>